<template>
	<view class="bigView">
		<view class="topView">
			<view class="item">
				<view class="title">付款积分</view>
				<view class="inputView">
					<u--input
					    placeholder="请输入积分"
					    border="surround"
					    v-model="form.ruleSettings"
					  ></u--input>
				</view>
			</view>
			<view class="item" style="margin-top: 8px;">
				<view class="title">支付密码</view>
				<view class="inputView">
					<u--input
					    placeholder="请输入支付密码"
					    border="surround"
					    v-model="form.paymentPassword"
						type="password"
					  ></u--input>
				</view>
			</view>
		</view>
		<view class="bottomView" :style="[{height:bottom + 'px'}]">
			<view class="sure" @click="sureHandle">付款</view>
		</view>
	</view>
</template>

<script>
	import { isJZNull } from '../../utils/auth'
	import points from '@/api/points.js'
	export default{
		data(){
			return {
				bottom:0,
				status:0,
				userInfo:{},
				shopId:'',
				form:{
					ruleSettings:'',
					userId:'',
					paymentPassword:''
				}
			}
		},
		mounted() {
			uni.getSystemInfo({success: (e) => {
				// this.StatusBar = e.statusBarHeight;
				let custom = wx.getMenuButtonBoundingClientRect();
				this.bottom = custom.bottom;
				// this.CustomBar = custom.bottom + custom.top - e.statusBarHeight;
				// this.TopHeight = this.CustomBar+100;//this.StatusBar+this.CustomBar;
			}})
		},
		onLoad(options){
			if(options.shopId){
				this.shopId = options.shopId;
			}
			this.initUserInfo()
		},
		methods:{
			sureHandle(){
				if(isJZNull(this.form.ruleSettings)){
					uni.showToast({
						title:"积分不能为空"
					})
					return;
				}
				if(isJZNull(this.form.paymentPassword)){
					uni.showToast({
						title:"支付密码不能为空"
					})
					return;
				}
				uni.showLoading({
					title:"提交中..."
				})
				points.deductPaymentUser({
					shopId: this.shopId,
					userId:this.form.userId,
					ruleSettings:this.form.ruleSettings,
					paymentPassword:this.form.paymentPassword
				}).then(res=>{
					uni.hideLoading();
					// uni.showToast({
					// 	icon:'none',
					// 	title:"操作成功"
					// })
					// uni.navigateBack()
					setTimeout(()=>{
						this.jumpPayResult(this.form.ruleSettings)
					},500)
					
				}).catch(err=>{
					uni.hideLoading()
				})
				
			},
			jumpPayResult(value){
				uni.navigateTo({
					url: '/pageageMine/pages/userPayResult?ruleSettings='+value
				})
			},
			initUserInfo(){
				const userInfo = uni.getStorageSync("userInfo")
				if(userInfo){
					this.userInfo = JSON.parse(userInfo);
					this.form.userId = this.userInfo.id;
				}
			},
		}
	}
</script>

<style lang="scss" scoped>
.bigView{
	width: 100vw;
	height: 100vh;
	background-color: #F7F7F7;
	display: flex;
	flex-direction: column;
	// align-items: center;
	// justify-content: center;
}
.item{
	width: 100vw;
	display: flex;
	flex-direction: column;
	background-color: white;
	.title{
		margin-left: 16px;
		margin-top: 16px;
	}
	.inputView{
		width: calc(100vw - 32px);
		margin-left: 10px;
		margin-top: 12px;
		margin-bottom: 12px;
		// background-color: red;
	}
}
.topView{
	margin-top: 8px;
	flex-grow: 1;
	display: flex;
	flex-direction: column;
}
.bottomView{
	height: 150px;
	width: 100vw;
	// background-color: yellow;
	display: flex;
	justify-content: center;
	.sure{
		width: calc(100vw - 32px);//calc(100vw-#{32px});
		height: 48px;
		border-radius: 24px;
		background-color: #247BFD;
		display: flex;
		align-items: center;
		justify-content: center;
		color: white;
	}
}
</style>